---
title: Guidelines
redirect_from:
  - /components/linklist/
---

<ReactExample exampleId="LinkList-default" />

## When to use

- For many links to other parts of your app.
- To give structure to such links to allow scanning.
- Inside [drawers](/components/overlay/drawer/).

## When not to use

- For lists that aren't just links---use a [list](/components/structure/list/).

## Component status

<ComponentStatus component="LinkList" />

## Content

### Use parallel structures

Each link in the list should be phrased in a similar way.
This consistency helps users scan to find the link they need.

<GuidelinesSideBySide>

<Do>

- - About us
  - Careers
  - Media room
- - Refer a friend
  - Subscribe to our newsletter
  - Read our stories
- - Travel
  - Cars
  - Rooms

</Do>

<Dont>

- - Find out about us
  - Careers
  - Items for the media
- - Refer a friend
  - Newsletter subscription
  - Stories
- - Travel
  - Rent a car
  - Rooms for rent

</Dont>

</GuidelinesSideBySide>

### Use icons for types

[Icons](/components/visuals/icon/) make longer lists easier to scan.
They can help group types of links,
such as links to legal terms vs. account details.

Remember that too many different icons can draw too much attention and overwhelm users.
Don't distract from more important actions.
